.exam-box{
  height: 100px;
  text-align: center;
  margin: 10px 10px 0px 10px;
  border-bottom: 1px solid rgba(53, 54, 56, 0.05);
  display: grid;
  grid-template-columns: 2fr repeat(3,1fr);
  grid-template-rows: repeat(1,minmax(0,1fr));
  justify-items: start;
  align-items: center;
  padding: 0.5rem 0.75rem;

  .exam-box-left{
    overflow: hidden;
    text-align: left;
  }
  
  .easy{
    color: rgba(0,175,155,1);
  }
  .middle{
    color: rgba(255,184,0,1);
  }
  .hard{
    color: rgba(255,45,85,1);
  }
  
  .exam-box-right{
    justify-self: end;
    .exam-status{
      width: 100%;
      height: 35px;
      line-height: 35px;
      border-radius: 3px;
      color: #007AFF;
      background-color: rgba(0,10,32,.05);
      float: right;
      padding: 0 0.75rem;
      font-size: 15px;
    }
    .exam-status-finish{
      color: rgb(46, 196, 46);
      background: none;
    }
  }
}